<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %>

	<link type="text/css" rel="stylesheet" href="../resources/css/bootstrap.min.css" />
	<link type="text/css" rel="stylesheet" href="../resources/css/style.css" />
	<script type="text/javascript" src="../resources/js/jquery.js"></script>
	<script type="text/javascript" src="../resources/js/bootstrap.min.js"></script>
	
	<script type="text/javascript">
	$(document).ready(function(){
		$("#table #rows").click(function(){
			   $(this).addClass('selected').siblings().removeClass('selected');    
			   var idlichlamviec = $(this).find('td:eq(0)').html();
			   var tuan = $(this).find('td:eq(1)').html();
			   var ngay = $(this).find('td:eq(2)').html();
			   var thoigianbatdau = $(this).find('td:eq(3)').html();
			   var thoigianketthuc = $(this).find('td:eq(4)').html();
			   var noidung = $(this).find('td:eq(5)').html();
			   var diadiem = $(this).find('td:eq(6)').html();
			   var ghichu = $(this).find('td:eq(7)').html();
			  	$('#idlichlamviec_s').val(idlichlamviec);
			  	$('#tuan_s').val(tuan);
			  	$('#datepicker_s').val(ngay);
				$('#timepicker_batdau_s').val(thoigianbatdau);
				$('#timepicker_ketthuc_s').val(thoigianketthuc);
				$('#noidung_s').val(noidung);
				$('#diadiem_s').val(diadiem);
				$('#ghichu_s').val(ghichu);
				
				$('#btnDelete').attr('href', 'xoalichlamviec/'+idlichlamviec);
				  
			  })
	});	
	$(function() {
		$( "#datepicker_s" ).datepicker({ dateFormat: 'dd-mm-yy' });
	});
	</script>
	
	  <script type="text/javascript">
            $(document).ready(function() {
                $('#timepicker_batdau_s').timepicker();
            });
            $(document).ready(function() {
                $('#timepicker_ketthuc_s').timepicker();
            });

        </script>
	
	

<!-- MODAL THEM LICH LAM VIEC -->

<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">Thêm</button>

<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			<h4 class="modal-title" id="myModalLabel">Thêm Lịch Làm Việc</h4>
			</div><!--end .modal-header  -->
				<form action="themlichlamviec" method="post" class="form-horizontal" accept-charset="UTF-8">
					<div class="modal-body">
					<div class="form-group">
						<label for="tuan" class="col-lg-3 control-label">Tuần</label>
						<div class="col-lg-9">
						<input class="form-control" id="tuan" name="tuan" placeholder="Tuần" type="text">
					</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="ngay" class="col-lg-3 control-label">Ngày</label>
						<div class="col-lg-9">
						  <input class="form-control" name="ngay" type="text" id="datepicker" placeholder="Ngày">
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="thoigianbatdau" class="col-lg-3 control-label">Thời gian bắt đầu</label>
						<div class="col-lg-9">
							<input class="form-control"  name="thoigianbatdau" type="text" id="timepicker_batdau" placeholder="Thời gian bắt đầu" />
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="thoigianketthuc" class="col-lg-3 control-label">Thời gian kết thúc</label>
						<div class="col-lg-9">
							<input class="form-control"  name="thoigianketthuc" type="text" id="timepicker_ketthuc" placeholder="Thời gian kết thúc" />
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="noidung" class="col-lg-3 control-label">Nội dung</label>
						<div class="col-lg-9">
						<textarea class="form-control" rows="3" id="noidung" name="noidung" placeholder="Nội dung"></textarea>
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="diadiem" class="col-lg-3 control-label">Địa điểm</label>
						<div class="col-lg-9">
						  <input class="form-control" id="diadiem" name="diadiem" placeholder="Địa điểm" type="text">
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="ghichu" class="col-lg-3 control-label">Ghi chú</label>
						<div class="col-lg-9">
						<textarea class="form-control" rows="3" id="ghichu" name="ghichu" placeholder="Ghi chú"></textarea>
						</div>
					</div><!-- end form-group-->

					</div><!-- END modal-body -->
						<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">Đóng</button>
						<button type="submit" class="btn btn-primary">Lưu</button>
						</div>
					
				</form><!-- end form -->

		</div><!-- end .modal-content -->
	</div><!--end .modal-dialog modal-lg -->
</div><!-- end .modal fade bs-example-modal-lg -->

<!-- END MODAL THEM LICH LAM VIEC -->	

<!-- MODAL SUA LICH LAM VIEC -->


<div class="modal fade sualichlamviec" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			<h4 class="modal-title" id="myModalLabel">Sửa Lịch Làm Việc</h4>
			</div><!--end .modal-header  -->
			<div class="modal-body">
				<form action="capnhatlichlamviec" method="post" class="form-horizontal" accept-charset="UTF-8">
					<div class="form-group">
						<label for="idlichlamviec" class="col-lg-3 control-label">ID</label>
						<div class="col-lg-9">
						<input class="form-control" id="idlichlamviec_s" name="idlichlamviec"  readonly placeholder="ID" type="text">
					</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="tuan" class="col-lg-3 control-label">Tuần</label>
						<div class="col-lg-9">
						<input class="form-control" id="tuan_s" name="tuan" placeholder="Tuần" type="text">
					</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="ngay" class="col-lg-3 control-label">Ngày</label>
						<div class="col-lg-9">
						  <input class="form-control" name="ngay" type="text" id="datepicker_s">
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="thoigianbatdau" class="col-lg-3 control-label">Thời gian bắt đầu</label>
						<div class="col-lg-9">
							<input class="form-control"  name="thoigianbatdau" type="text" id="timepicker_batdau_s" />
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="thoigianketthuc" class="col-lg-3 control-label">Thời gian kết thúc</label>
						<div class="col-lg-9">
							<input class="form-control"  name="thoigianketthuc" type="text" id="timepicker_ketthuc_s" />
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="noidung" class="col-lg-3 control-label">Nội dung</label>
						<div class="col-lg-9">
						<textarea class="form-control" rows="3" id="noidung_s" name="noidung"></textarea>
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="diadiem" class="col-lg-3 control-label">Địa điểm</label>
						<div class="col-lg-9">
						  <input class="form-control" id="diadiem_s" name="diadiem" placeholder="Địa điểm" type="text">
						</div>
					</div><!-- end form-group-->
					<div class="form-group">
						<label for="ghichu" class="col-lg-3 control-label">Ghi chú</label>
						<div class="col-lg-9">
						<textarea class="form-control" rows="3" id="ghichu_s" name="ghichu"></textarea>
						</div>
					</div><!-- end form-group-->

					<button type="button" class="btn btn-default" data-dismiss="modal">Đóng</button>
					<button type="submit" class="btn btn-primary">Lưu</button>
					
				</form><!-- end form -->
			</div><!-- END modal-body -->
		
		</div><!-- end .modal-content -->
	</div><!--end .modal-dialog modal-lg -->
</div><!-- end .modal fade bs-example-modal-lg -->

<!-- END MODAL SUA LICH LAM VIEC -->

<!-- MODAL xoa lich lam viec-->
<div class="modal fade" id="delete" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Xóa nhân viên</h4>
</div>
<div class="modal-body">
	<h1 style="color: red;">Bạn có chắc chắn muốn xóa không ??</h1>
</div><!-- END modal-body -->
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Hủy</button>
    <a class="btn btn-primary" id="btnDelete" >Xóa</a>
</div>
</div><!-- END modal-content -->
</div><!-- END modal-dialog modal-lg -->
</div><!-- END modal fade bs-example-modal-lg -->
<!-- END MODAL XOA lich lam viec-->	

<c:if test="${!empty listLichLamViec}">
 <h2 class="day" ><fmt:formatDate value="${ngay}" pattern="dd-MM-yyyy" /></h2>
	<table class="table table-hover" id="table">
		<tr>
			<th width="80">ID</th>
			<th width="80">Tuần</th>
			<th width="120">Ngày</th>
			<th width="80">Thời gian bắt đầu</th>
			<th width="120">Thời gian kết thúc</th>
			<th width="120">Nội dung</th>
			<th width="120">Địa điểm</th>
			<th width="120">Ghi chú</th>
			<th width="120">Sửa</th>
			<th width="120">Xóa</th>
			
		</tr>
		<c:forEach items="${listLichLamViec}" var="lichlamviec">
		<tr id="rows">
			<td>${lichlamviec.idLichLamViec}</td>
			<td>${lichlamviec.tuan}</td>
			 <td><fmt:formatDate value="${lichlamviec.ngay}" pattern="dd-MM-yyyy" /></td>
			 <td><fmt:formatDate value="${lichlamviec.thoiGianBatDau}" pattern="hh:mm" /></td>
			 <td><fmt:formatDate value="${lichlamviec.thoiGianKetThuc}" pattern="hh:mm" /></td>
			 <td>${lichlamviec.noiDung}</td>
			 <td>${lichlamviec.diaDiem}</td>
			 <td>${lichlamviec.ghiChu}</td>
			 <td><button type="button" class="btn btn-primary" data-toggle="modal" data-target=".sualichlamviec">Sửa</button></td>
			<td><a class="btn btn-primary" data-toggle="modal" href="#delete">Xóa</a></td>

		 </tr>
		</c:forEach>
	</table>
</c:if>
